<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="css/luntankong.css" rel="stylesheet">

<script src="js/jquery-1.8.2.min.js"></script>
<script src="js/jquery-ui-1.10.0.custom.min.js"></script>
<script src="js/jquery.dropkick-1.0.0.js"></script>
<script src="js/custom_checkbox_and_radio.js"></script>
<script src="js/custom_radio.js"></script>
<script src="js/jquery.tagsinput.js"></script>
<script src="js/bootstrap-tooltip.js"></script>
<script src="js/jquery.placeholder.js"></script>
<script src="js/application.js"></script>
<script src="js/jquery.masonry.min.js" type="text/javascript"></script>
<script type="text/javascript" src="js/jquery.toastmessage-min.js"></script>
<script src="js/luntankong.js"></script>

<script src='js/picnet.table.filter.min.js'></script>


<title>user behaviour报告</title>
</head>
<body>
    Only Show Yes: <input type='checkbox' id='onlyyes'/>          
    Only Show No: <input type='checkbox' id='onlyno'/>
         &nbsp;<input type='submit' value='Set Quick Find filter and refresh table' onClick="$('#quickfind').val('zhihu'); $('#demotable1').tableFilterApplyFilterValues();"/>
 
    Quick Find: <input type='text' id='quickfind'/>

    <a id='cleanfilters' href='#'>Clear Filters</a>
    <div class='clear'></div>
    <br/>
    
    
<table id="ubtable">
<thead>
        
<tr title="">
	<th class="field messge" filter='false'>No</th>
    <th class="field messge" title="操作日期" filter-type='ddl'>操作日期</th>
	<th class="field" filter-type='ddl'>用户</th>
	<th class="field position" filter-type='ddl'>SEQ</th>
	<th class="field position" filter-type='ddl'>类别</th>
    <th class="field messge" title="$item.get("paras")" filter-type='ddl'>页面</th>
    <th class="field messge" filter-type='ddl'>按钮</th>
    <th class="field messge" title="距离程序打开" filter='false'>启动</th>
    <th class="field messge" title="操作时间" filter='false'>时间</th>
    <th class="field messge" filter='false'>上下文信息</th>
</tr>
</thead>

<tbody>
#set($i = 0)
#foreach($item in $items)
#set($i = $i+1)
<tr title='$item.get("jsonobj")'>
 	<td class="field messge">$i.</td>
    <td class="field messge" title="操作日期">$!item.get("actiondate")</td>
	<td class="field">$item.get("uid")</td>
	<td class="field position">$!item.get("actionseq")</td>
	<td class="field position">$!item.get("action")</td>
    <td class="field messge" title="$item.get("paras")">$item.get("page")</td>
    <td class="field messge">$!item.get("element")</td>
    <td class="field messge" title="距离程序打开 ">$item.get("startupduration")</td>
    <td class="field messge" title="操作时间">$!item.get("actiontime")</td>
    <td class="field messge">$!item.get("context")</td>
   
</tr>



#end
</tbody>
</table>

</body>

<script language="javascript">

$(document).ready(function () {
	 // Initialise Plugin
            var options1 = {
                additionalFilterTriggers: [$('#onlyyes'), $('#onlyno'), $('#quickfind')],
                clearFiltersControls: [$('#cleanfilters')],
                matchingRow: function(state, tr, textTokens) {
                  if (!state || !state.id) {
                    return true;
                  }
                  var child = tr.children('td:eq(2)');
                  if (!child) return true;
                  var val = child.text();
                  switch (state.id) {
                  case 'onlyyes':
                    return state.value !== true || val === 'yes';
                  case 'onlyno':
                    return state.value !== true || val === 'no';
                  default:
                    return true;
                  }
                }
            };

            $('#ubtable').tableFilter(options1);
			
			
	//$('#ubtable').tableFilter();
    screenshotPreview();
});


</script>


<style>
.hidden{
	display:none
}
th{
	text-align:left;
	padding:4px;
	font-size:10px;
}
td{
	padding:4px;
	font-size:10px;
	white-space: nowrap; 
}
.seq{
	color:#999;
}
.timehuman{
	color:#999;
	display:none;
}
.position{
}
.messge{
	font-size:14px;
}



</style>


</html>
